<script>
export default price;
import price from "./index";
</script>
<!--src 引用css样式-->
<style src="./index.css" lang="css"></style>

<template>
  <div class="brand-wrapper">
    <!--搜索功能-->
    <div class="search-form">
      <el-form :inline="true" class="demo-form-inline">
        <el-form-item label="商品名称" size="mini">
          <el-input placeholder="商品名称" v-model="searchParams.brandName"></el-input>
        </el-form-item>
        <el-form-item label="审批状态" size="mini">
          <el-select v-model="searchParams.auditStatus" placeholder="请选择">
            <el-option
                v-for="item in options"
                :key="item.value"
                :label="item.label"
                :value="item.value">
            </el-option>
          </el-select>
        </el-form-item>
        <br>
        <el-form-item label="生效时间" size="mini">
          <el-date-picker
              v-model="searchParams.teffectiveTime"
              value-format="yyyy-MM-dd"
              type="date"
              placeholder="选择日期">
          </el-date-picker>
<!--          <el-date-picker-->
<!--              v-model="pickerOptions.startDate"-->
<!--              type="datetimerange"-->
<!--              :picker-options="pickerOptions"-->
<!--              value-format="yyyy-MM-dd HH:mm:ss"-->
<!--              range-separator="-"-->
<!--              start-placeholder="开始日期"-->
<!--              end-placeholder="结束日期"-->
<!--              align="right"-->
<!--              @change="chooseTime">-->
<!--          </el-date-picker>-->

        </el-form-item>
        <el-form-item label="失效时间" size="mini">
          <el-date-picker
              v-model="searchParams.invalidTime"
              value-format="yyyy-MM-dd"
              type="date"
              placeholder="选择日期">
          </el-date-picker>
        </el-form-item>


        <el-button type="primary" size="mini" @click="searchPage">查询</el-button>
        <el-button type="warning" size="mini" @click="resetForm">重置</el-button>
      </el-form>
    </div>
    <!--查询按钮-->


    <!--table表格-->
    <div class="table-box">

      <el-table
          :data="tableData"
          style="width: 100%"
          @selection-change="selectChange">
        <el-table-column
            type="selection"
            width="55" align="center">
        </el-table-column>
        <el-table-column type="expand">
          <template slot-scope="props">
            <el-form label-position="left" inline class="demo-table-expand">
              <el-form-item label="商品ID：" label-width="150px">
                <el-tag><span size="small">{{ props.row.goodsId }}</span></el-tag>
              </el-form-item>
              <el-form-item label="商品名称：" label-width="150px">
                <el-tag><span size="small">{{ props.row.goodsName }}</span></el-tag>
              </el-form-item>
              <el-form-item label="商品库存：" label-width="150px">
                <el-tag><span size="small">{{ props.row.goodsStock }}</span></el-tag>
              </el-form-item>
              <el-form-item label="商品原始市场价：" label-width="150px">
                <el-tag><span size="small">{{ props.row.salePrice }}</span></el-tag>
              </el-form-item>
              <el-form-item label="商品原始商城价：" label-width="150px">
                <el-tag><span size="small">{{ props.row.mallPrice }}</span></el-tag>
              </el-form-item>
              <el-form-item label="商品调整市场价：" label-width="150px">
                <el-tag><span size="small">{{ props.row.adjustmentSalePrice }}</span></el-tag>
              </el-form-item>
              <el-form-item label="商品调整商城价：" label-width="150px">
                <el-tag><span size="small">{{ props.row.adjustmentMallPrice }}</span></el-tag>
              </el-form-item>
              <el-form-item label="希望生效时间：" label-width="150px">
                <el-tag><span size="small">{{ props.row.teffectiveTime }}</span></el-tag>
              </el-form-item>
              <el-form-item label="活动情况或原因：" label-width="150px">
                <el-tag><span size="small">{{ props.row.reason }}</span></el-tag>
              </el-form-item>

              <el-form-item label="希望失效时间：" label-width="150px">
                <el-tag><span size="small">{{ props.row.invalidTime }}</span></el-tag>
              </el-form-item>
              <el-form-item label="备注:" label-width="150px">
                <el-tag><span size="small">{{ props.row.remarks }}</span></el-tag>
              </el-form-item>


              <!--            <el-form-item label="商品图片">-->
              <!--              <el-avatar  :src="props.row.goodsImg" size="small"  height="50px"></el-avatar>-->
              <!--            </el-form-item>-->


            </el-form>
          </template>
        </el-table-column>
        <el-table-column
            prop="id"
            label="序号"
            width="200" align="center">
        </el-table-column>
        <el-table-column
            prop="goodsName"
            label="商品名称"
            width="200" align="center">
        </el-table-column>
        <el-table-column
            prop="mallPrice"
            label="原商城价"
            width="200" align="center">
        </el-table-column>
        <el-table-column
            prop="adjustmentMallPrice"
            label="调整后商城价"
            width="200" align="center">
        </el-table-column>
        <el-table-column
            prop="teffectiveTime"
            label="希望生效时间"
            width="250" align="center">
        </el-table-column>
        <el-table-column
            prop="auditStatus"
            label="审批状态"
            width="200" align="center">
        </el-table-column>
        <el-table-column
            prop="address"
            label="操作" align="center">

          <template v-slot="obj">
            <el-button type="success" icon="el-icon-edit" size="mini"
                       @click="dialogFormVisible=true,formData.id=obj.row.id,pricefindById(obj.row)"
                       v-if="obj.row.auditStatus==='未审核'"
                       style="margin-right: 5px">审核</el-button>
<!--            <el-popconfirm-->
<!--                confirm-button-text='确定'-->
<!--                cancel-button-text='取消'-->
<!--                icon="el-icon-info"-->
<!--                icon-color="red"-->
<!--                title="确定删除吗？"-->
<!--                @confirm="deleteById">-->
<!--              <el-button type="danger" slot="reference" icon="el-icon-delete" size="mini"-->
<!--                         @click="id=obj.row.id"-->
<!--                         style="margin-right: 5px"></el-button>-->
<!--            </el-popconfirm>-->
            <el-button plain size="mini"
                       @click="dialogFormVisible2=true,formData1.id=obj.row.id,pricefindById(obj.row)"

            >审核跟踪</el-button>

          </template>

        </el-table-column>
      </el-table>
    </div>
    <!--分页-->
    <div class="page-box">
      <el-pagination
          background
          layout="prev, pager, next"
          :current-page="this.searchParams.currentPage"
          :page-size="this.searchParams.pageSize"
          @current-change="currentPageChange"
          :total="total" align="right">
      </el-pagination>
    </div>

    <!-- 弹框dialog-->
    <div class="dialog-box">
      <el-dialog title="审核" :visible.sync="dialogFormVisible" width="30%">
        <el-form :model="formData" label-width="80px">
          <el-form-item label="商品ID:" size="mini">
            <el-input autocomplete="off" v-model="formData.goodsId" :disabled=true></el-input>
          </el-form-item>
          <el-form-item label="商品名称:" size="mini">
            <el-input autocomplete="off" v-model="formData.goodsName" :disabled=true></el-input>
          </el-form-item>
          <el-form-item label="商品库存:" size="mini">
            <el-input autocomplete="off" v-model="formData.goodsStock" :disabled=true></el-input>
          </el-form-item>
          <el-form-item label="商品原始市场价:" size="mini">
            <el-input autocomplete="off" v-model="formData.salePrice" :disabled=true></el-input>
          </el-form-item>
          <el-form-item label="商品原始商城价:" size="mini">
            <el-input autocomplete="off" v-model="formData.mallPrice" :disabled=true></el-input>
          </el-form-item>
          <el-form-item label="" size="mini">
            <el-switch
                v-model="formData.value1"
                active-text="右上调"
                inactive-text="左下调"
                @change="tiao"
                :disabled=true>
            </el-switch>
            <el-switch
                style="display: block"
                v-model="formData.value2"
                active-color="#13ce66"
                inactive-color="#ff4949"
                active-text="右百分比"
                inactive-text="左绝对值"
                @change="zhi"
                :disabled=true>
            </el-switch>
          </el-form-item>
          <el-form-item label="调整:" size="mini">
            <el-input autocomplete="off" size="mini" v-model="formData.priceAdjustmentRange" @focus="jisuan" :disabled=true></el-input>
          </el-form-item>
          <el-form-item label="商品调整市场价:" size="mini">
            <el-input autocomplete="off" v-model="formData.adjustmentSalePrice" :disabled=true></el-input>
          </el-form-item>
          <el-form-item label="商品调整商城价:" size="mini">
            <el-input autocomplete="off" v-model="formData.adjustmentMallPrice" :disabled=true></el-input>
          </el-form-item>
          <el-form-item label="希望生效时间:" size="mini">
            <el-date-picker
                v-model="formData.teffectiveTime"
                value-format="yyyy-MM-dd"
                type="date"
                placeholder="选择日期"
                :disabled=true>
            </el-date-picker>

          </el-form-item>
          <el-form-item label="希望失效时间:" size="mini">
            <el-date-picker
                v-model="formData.invalidTime"
                value-format="yyyy-MM-dd"
                type="date"
                placeholder="选择日期"
                :disabled=true>
            </el-date-picker>

          </el-form-item>
          <!--          <el-form-item label="品牌描述" size="mini">-->
          <!--            <el-input autocomplete="off" v-model="formData.brandDescribe"></el-input>-->
          <!--          </el-form-item>-->
          <el-form-item label="调价原因:" size="mini">
            <el-input
                type="textarea"
                :rows="2"
                placeholder="请输入内容"
                v-model="formData.reason"
                :disabled=true>
            </el-input>
          </el-form-item>
          <el-form-item label="备注:" size="mini">
            <el-input
                type="textarea"
                :rows="2"
                placeholder="请输入内容"
                v-model="formData.remarks"
                :disabled=true>
            </el-input>
          </el-form-item>

          <el-form-item label="审批意见:" size="mini">
            <el-input
                type="textarea"
                :rows="2"
                placeholder="请输入内容"
                v-model="formData.auditComments"
               >
            </el-input>
          </el-form-item>

        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button type="success" plain @click="dialogFormVisible = false,pass()" size="mini">审核通过</el-button>
          <el-button type="info" plain @click="dialogFormVisible = false,noPass()" size="mini">审核不通过</el-button>
          <el-button type="primary" @click="dialogFormVisible = false" size="mini">返 回</el-button>
        </div>
      </el-dialog>
    </div>
 <!-- 弹框dialog-->
    <div class="dialog-box">
      <el-dialog title="审核跟踪" :visible.sync="dialogFormVisible2" width="30%">
        <el-form :model="formData1" label-width="80px">
          <el-form-item label="商品ID:" size="mini">
            <el-input autocomplete="off" v-model="formData1.goodsId" :disabled=true></el-input>
          </el-form-item>
          <el-form-item label="商品名称:" size="mini">
            <el-input autocomplete="off" v-model="formData1.goodsName" :disabled=true></el-input>
          </el-form-item>
          <el-form-item label="商品库存:" size="mini">
            <el-input autocomplete="off" v-model="formData1.goodsStock" :disabled=true></el-input>
          </el-form-item>
          <el-form-item label="商品原始市场价:" size="mini">
            <el-input autocomplete="off" v-model="formData1.salePrice" :disabled=true></el-input>
          </el-form-item>
          <el-form-item label="商品原始商城价:" size="mini">
            <el-input autocomplete="off" v-model="formData1.mallPrice" :disabled=true></el-input>
          </el-form-item>
          <el-form-item label="" size="mini">
            <el-switch
                v-model="formData1.value1"
                active-text="右上调"
                inactive-text="左下调"
                @change="tiao"
                :disabled=true>
            </el-switch>
            <el-switch
                style="display: block"
                v-model="formData1.value2"
                active-color="#13ce66"
                inactive-color="#ff4949"
                active-text="右百分比"
                inactive-text="左绝对值"
                @change="zhi"
                :disabled=true>
            </el-switch>
          </el-form-item>
          <el-form-item label="调整:" size="mini">
            <el-input autocomplete="off" size="mini" v-model="formData1.priceAdjustmentRange" @focus="jisuan" :disabled=true></el-input>
          </el-form-item>
          <el-form-item label="商品调整市场价:" size="mini">
            <el-input autocomplete="off" v-model="formData1.adjustmentSalePrice" :disabled=true></el-input>
          </el-form-item>
          <el-form-item label="商品调整商城价:" size="mini">
            <el-input autocomplete="off" v-model="formData1.adjustmentMallPrice" :disabled=true></el-input>
          </el-form-item>
          <el-form-item label="希望生效时间:" size="mini">
            <el-date-picker
                v-model="formData1.teffectiveTime"
                value-format="yyyy-MM-dd"
                type="date"
                placeholder="选择日期"
                :disabled=true>
            </el-date-picker>

          </el-form-item>
          <el-form-item label="希望失效时间:" size="mini">
            <el-date-picker
                v-model="formData1.invalidTime"
                value-format="yyyy-MM-dd"
                type="date"
                placeholder="选择日期"
                :disabled=true>
            </el-date-picker>

          </el-form-item>
          <!--          <el-form-item label="品牌描述" size="mini">-->
          <!--            <el-input autocomplete="off" v-model="formData.brandDescribe"></el-input>-->
          <!--          </el-form-item>-->
          <el-form-item label="调价原因:" size="mini">
            <el-input
                type="textarea"
                :rows="2"
                placeholder="请输入内容"
                v-model="formData1.reason"
                :disabled=true>
            </el-input>
          </el-form-item>
          <el-form-item label="备注:" size="mini">
            <el-input
                type="textarea"
                :rows="2"
                placeholder="请输入内容"
                v-model="formData1.remarks"
                :disabled=true>
            </el-input>
          </el-form-item>
          <el-form-item label="审批人:" size="mini">
            <el-input
                type="textarea"
                :rows="2"
                placeholder="请输入内容"
                v-model="formData1.reviewer"
                :disabled=true>
            </el-input>
          </el-form-item>
          <el-form-item label="审批时间:" size="mini">
            <el-input
                type="textarea"
                :rows="2"
                placeholder="请输入内容"
                v-model="formData1.auditTime"
                :disabled=true>
            </el-input>
          </el-form-item>
          <el-form-item label="审批状态:" size="mini">
            <el-input
                type="textarea"
                :rows="2"
                placeholder="请输入内容"
                v-model="formData1.auditStatus"
                :disabled=true>
            </el-input>
          </el-form-item>
          <el-form-item label="审批意见:" size="mini">
            <el-input
                type="textarea"
                :rows="2"
                placeholder="请输入内容"
                v-model="formData1.auditComments"
                :disabled=true>
            </el-input>
          </el-form-item>

        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button @click="dialogFormVisible2 = false" size="mini">返回</el-button>
<!--          <el-button type="primary" @click="dialogFormVisible = false,saveOrUpdate(),dialogFormVisible1=false" size="mini">确 定</el-button>-->
        </div>
      </el-dialog>
    </div>


  </div>
</template>
